import React, { useEffect } from 'react';
import { Card, Typography } from 'antd';
import { useParams } from 'react-router-dom';
import { useAppDispatch } from '../../store';
import { setBreadcrumbs } from '../../store/slices/uiSlice';

const { Title } = Typography;

const UserDetail: React.FC = () => {
  const { id } = useParams();
  const dispatch = useAppDispatch();

  useEffect(() => {
    dispatch(setBreadcrumbs([
      { title: '用户管理', path: '/users' },
      { title: '用户列表', path: '/users' },
      { title: `用户详情 (${id})` },
    ]));
  }, [dispatch, id]);

  return (
    <div>
      <Title level={2}>用户详情</Title>
      <Card>
        <p>用户ID: {id}</p>
        <p>用户详情功能正在开发中...</p>
      </Card>
    </div>
  );
};

export default UserDetail;
